import styled from 'styled-components'
import border from 'components/styled/border.js'
// 拿到iconStyled后，怎么把它引入SearchContainer组件中？
// 利用函数调用形式
import iconStyled from 'components/styled/icons.js'

const SearchContainer = iconStyled(
    styled.div`
        padding:.12rem .15rem;
        background:${props=>props.outerBg};
            
    `
)

const BorderContainer = border({
    color:'#ee742f',
    radius:6,
    
    comp:styled.div`
        height:.4rem;
        border-radius:.04rem;
        display:flex;
        justify-content:center;
        align-items:center;
        background:${props=>props.innerBg}
        i {
            font-family:'iconfont';
            margin-right:.03rem;
            color:#ee742f;
        }
        input{
            background:transparent;
            border:0;
            width:1.6rem;

        }
    `
})

export{
    SearchContainer,
    BorderContainer
}